﻿.loginContainer,
.logo,
.login,
.login input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.loginContainer,
.logo {
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

// 整个背景图
.loginContainer {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #333c52;
  background-image: url("@mars/components/mars-ui/assets/images/login/login-bg-color.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;

  .login-bg-earth {
    width: 67%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
}

// 标题
.login-title {
  position: relative;
  width: 754px;
  height: 96px;
  margin: auto;
  padding: 18px 45px;
  color: white;
  font-weight: bold;
  font-size: 36px;
  text-align: center;
  letter-spacing: 0.1em;
  background-image: url("@mars/components/mars-ui/assets/images/login/login-title-bg.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;

  &:before {
    content: "";
    width: 54px;
    height: 44px;
    position: relative;
    top: 10px;
    display: inline-block;
    // background-image: url("@mars/components/mars-ui/assets/images/login/login-title-logo.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
  }
}

// 登录页面内容
.login-pannel {
  width: 380px;
  height: 500px;
  position: fixed;
  right: 75px;
  top: 50%;
  transform: translateY(-46.5%);

  background-image: url("@mars/components/mars-ui/assets/images/login/login-content-bg.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;

  padding: 30px 30px 0 30px;

  // content标题
  .login-pannel_text {
    font-size: 30px;
    font-family: Source Han Sans CN;
    font-weight: bold;
    color: var(--mars-text-color);
  }

  .login-form {
    margin-top: 30px;

    .pannel-item-label {
      font-size: 18px;
      margin-bottom: 10px;
      font-family: Source Han Sans CN;
      font-weight: 400;
      color: #cdcdcd;
    }

    .mars-input,
    .mars-button {
      height: 100%;
    }

    .ant-input-group-wrapper {
      background: rgba(255, 255, 255, 0.1) !important;
      border: none;
      border-radius: 0;

      .mars-input,
      .ant-input,
      .ant-input-group-addon,
      .ant-input-affix-wrapper {
        border: none;
        color: #fff;
        background: none !important;
        outline: none !important;
      }

      .ant-input-group-addon {
        position: relative;
        padding: 0px 11px;

        &::after {
          content: "";
          display: block;
          position: absolute;
          top: 4px;
          right: 0;
          width: 1px;
          height: 35px;
          background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.98) 50%, rgba(255, 255, 255, 0) 100%);
          opacity: 0.5;
          border-radius: 0px;
        }
      }

      input {
        font-size: 18px;
      }

      .ant-input-suffix * {
        color: #fff;
      }

      .mars-icon {
        position: relative;
        top: 2px;
      }
    }
  }

  // 登录主体内容页脚火星科技小图片
  // &:after {
  //   content: "";
  //   width: 76px;
  //   height: 26px;
  //   position: absolute;
  //   bottom: 16px;
  //   left: 40%;
  //   background-image: url("@mars/components/mars-ui/assets/images/login/login-content-footer.png");
  //   background-size: 100% 100%;
  //   background-repeat: no-repeat;
  // }

  a {
    font-size: 14px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #cdcdcd;
  }
}

// 页脚
.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  text-align: center;
  color: white;
  text-transform: capitalize;
  font-size: 0.8em;
  padding: 2em 0;

  .footer-link {
    color: white;
  }
}

.code-info{
  position: relative;
  .login-code {
    position: absolute;
    right: 0;
    bottom: 6px;
    // width: 33%;
    width: 5.4vw;
    // height: 40px;
    height: 3.9vh;
    // float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    // border: #8c00ff solid 1px;
    z-index: 20;
    img {
      cursor: pointer;
      // vertical-align: middle;/**相对容器中分线对齐 */
      // width: 100%;
      width: 5.4vw;
      height: 3.9vh;
      // margin: 0 auto;
      // border: #d9ff00 solid 1px;
    }
  }
}

